<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<base href='<%=basePath%>'>
  <meta charset="utf-8">
  <title>分店销售</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 <link rel="stylesheet" href="res/layui/css/layui.css">
		<script src="res/js/jquery-2.1.4.min.js" type="text/javascript" ></script>
		<script src="res/layui/layui.js"></script>
		
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
  <style type="text/css">
  	input{
  		border-top: none;
  		border-left: none;
  		border-right: none;
  		border-color: #111;
  		
  }
	/* input::-webkit-outer-spin-button,
		input::-webkit-inner-spin-button {
		    -webkit-appearance: none !important;
		    margin: 0;
		} */
  table th{
  	border: 1px solid #111; 
  	text-align: center;
  	width: 200px;
  	height: 50px;
  	background-color: #E6E6E6;
  }
  table td{
  	border: 1px solid #111; 
  	text-align: center;
  	width: 200px;
  	height: 50px;
  }
  </style>
</head>
<body>
 
<div style="text-align: center;font-size: 35px;">
 	<span id="sell">销售</span> 
 </div>
<div style="margin-left: 100px;text-align: center; margin-left: 100px;" id="show">



</div>


<table id="showss">
	<tr>
		<th>药品名</th>
		<th>药品类型</th>
		<th>药品照片</th>
		<th>生产厂家</th>
		<th>价钱</th>
		<th>库存数</th>
		<th>购买数量</th>
		<th>购买价格</th>
	</tr>
	
</table> 



<script>

     


var table ;

layui.use('table', function(){
  table = layui.table;
 
});

                                              

 $(function(){
	var url="sell/selectbyWareId.action";
	$.post(url,null,function(beyond){
		for(i=0;i<beyond.length;i++){
			$("#show").html(
					'<input type="hidden" class="STAFF_ID" value="'+beyond[i].STAFF_ID+'">'+
					'<input type="hidden" class="ANNEX_ID" value="'+beyond[i].ANNEX_ID+'">'+
					'<span>操作人:<input type="text" value='+beyond[i].STAFF_NAME+'></span>'+
					'<span>分店名:<input type="text" value='+beyond[i].ANNEX_NAME+'></span>'
			)
		}
	})
	
})

/*刷新页面  */
function refresh() {
	parent.location.reload();
}

/* 追加显示 */
$(function(){
	var url ="sell/selectbyWareId.action";
	$.post(url,null,function(beyond){
		for(i=0;i<beyond.length;i++){
			$("#showss").append(
					'<tr>'+
					'<td><input type="hidden" class="wareId" name="wareId" value="'+beyond[i].WARE_ID+'">'+beyond[i].WARE_NAME+'</td>'+
					'<td class="typeName">'+beyond[i].TYPE_NAME+'</td>'+
					'<td><span class="wp"><img src="'+beyond[i].WARE_PHOTO+'" height="50px" /></span></td>'+
					'<td><span class="ware_factory">'+beyond[i].WARE_FACTORY+'</span></td>'+
					'<td><span class="ware_mom">'+beyond[i].WARE_MONEY+'</span></td>'+
					'<td><span class="in_num">'+beyond[i].inventory_num+'</span></td>'+
					'<td><input type="number" name="innum" id="num_'+beyond[i].WARE_ID+'" class="num22" onchange="num(this);"/></td>'+
					'<td name="price" class="price"></td>'+
					'</tr>'
			);
			
		}
		

	});
});




function num(obj){
	
  	var tr = $(obj).parent().parent();
  	var id =document.getElementById("showss");
  	var row = id.rows.length;

    var a=tr.children().eq(5).text();
  	var b = tr.children().eq(6).text();
  	var c = tr.children().eq(7).text();
  	var d = tr.children().eq(4).text();
  	
  	if(obj.value<0){
  		tr.children().eq(6).html(tr.children().eq(6).html());
  		tr.children().eq(7).val(tr.children().eq(6).html());
  		 layer.msg('购买数量不能小于0');
  		 return;
  	}
  	 if(obj.value>Number(a)){
  		 layer.msg('购买数量不能大于库存数');
  		tr.children().eq(6).html(tr.children().eq(6).html());
  		tr.children().eq(7).val(tr.children().eq(6).html());
  		return;
  	} 
  	
  	tr.children().eq(7).text(obj.value*d);
  	var price = $(".price");
  	var o=0;
  	$.each(price,function(i,item){
  		var prices= $(this).html();
  		o=o+Number(prices);
  		$("#span").html(o);
  	})
  	
  }
  

  
  function pay(id){
	  
	  var mytable = document.getElementById(id);
	  var url = "sell/update.action";
	  var data = "";
	  var o="";
	 var ware_id = $(".wareId");
	
	  var ware_mom = $(".ware_mom");
	  var in_num =$(".in_num");
	  var num22 =$(".num22") ;//输入的购买数量
	  var price =$(".price");
	  $(".wareId").each(function(i,item){
		var money = ware_mom[i].innerText;
		var kc_num = in_num[i].innerText;
		var input_num = num22[i].value;
		var sum_price = price[i].innerText;
		if(input_num==""){
			input_num=0;
			sum_price = 0; 
		}      
		var ware_id=$(this).val();
		data+= ware_id+"_"+money+"_"+kc_num+"_"+input_num+"_"+sum_price+"&";
		o+=sum_price;
	  });
	  if(o==""){
		  layer.msg('您还未选购商品');
	  }else{
		  $.post(url,{str:data},function(row){
	    	  if(row.state==1){
				  layer.msg('购买成功');
				  setTimeout("refresh()", 500);
			  }else{
				  layer.msg('购买失败');
			  }
	      })

	  }
    	  
  }
	  
	
</script>
<div>
<div style="font-size: 20px;" >
	 
	<span>结算总金额:</span><span  id="span"></span>
	<button class="layui-btn layui-btn-normal" style="float: right; margin-top: 20px;" onclick="pay('showss');">确认购买</button>
</div>
</div>
</body>
</html>